<%--
  Created by IntelliJ IDEA.
  User: 谢佳豪
  Date: 2020/10/24
  Time: 11:14
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html; charset=UTF-8" language="java" isErrorPage="false" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set value="${pageContext.request.contextPath}" var="path" scope="page"/>
<html lang="zh-CN" xmlns="http://www.w3.org/1999/html">

<head>
    <meta charset="UTF-8">
    <title>更新活动信息</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
    <link rel="Shortcut Icon" href="../../images/logo.ico" type="image/x-icon" />
    <link rel="stylesheet" href="${path}/css/bootstrap.css">
</head>

<body>
<!-- 头部导航栏 -->
<%@ include file="../header.jsp"%>

<!-- 发送消息 -->
<section>
    <div class="container">
        <div class="my-3 p-3 bg-white rounded shadow-sm">
            <h6 class="border-bottom border-gray pb-2 mb-0">
                发起活动
            </h6>
            <form class="mt-3" action="${path}/activity/update" method="post">
                <input type="text" name="activity_id" hidden value="${activity.activity_id}">
                <div class="form-group row">
                    <label for="inputTitle" class="col-sm-2 col-form-label">标题:</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control focus-form" name="title" id="inputTitle" value="${activity.title}"
                               required
                               autofocus>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="inputScale" class="col-sm-2 col-form-label">规模:</label>
                    <div class="col-sm-3">
                        <select class="form-control focus-form" id="inputScale" name="scale">
                            <option value="2" ${activity.scale == 2 ? 'selected' : ''}>校级</option>
                            <option value="1" ${activity.scale == 1 ? 'selected' : ''}>院级</option>
                            <option value="3" ${activity.scale == 3 ? 'selected' : ''}>省级</option>
                            <option value="4" ${activity.scale == 4 ? 'selected' : ''}>国家级</option>
                        </select>
                    </div>
                    <label for="inputType" class="col-sm-2 col-form-label text-md-right">类型:</label>
                    <div class="col-sm-3">
                        <select class="form-control focus-form" id="inputType" name="cid">
                            <c:forEach items="${catalogList}" var="catalog">
                                <option value="${catalog.cid}" ${activity.cid == catalog.cid ? 'selected' : ''}>${catalog.cname}</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="inputEndTime" class="col-sm-2 col-form-label">截至时间:</label>
                    <div class="col-sm-8">
                        <fmt:parseDate value="${activity.end_time}" pattern="yyyy-MM-dd HH:mm:ss" var="end_time"/>
                        <input type="datetime-local" class="form-control focus-form" id="inputEndTime"
                               name="end_time" value="<fmt:formatDate value="${end_time}" pattern="yyyy-MM-dd'T'HH:mm"/>">
                    </div>
                </div>
                <div class="form-group row">
                    <label for="inputContent" class="col-sm-2 col-form-label">内容:</label>
                    <div class="col-sm-8" id="editor">
                        <div id="div1"></div>
                        <textarea class="form-control" id="inputContent" name="content" rows="5"
                                  hidden></textarea>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-2"></div>
                    <div class="col-sm-8">
                        <button type="submit" id="oa-btn" class="btn btn-primary mb-2 text-center oa-btn"
                                data-toggle="modal"
                                data-target="#OAModal">更新
                        </button>
                    </div>
                </div>
            </form>

        </div>
    </div>
</section>

<!-- 退出登录的模态框 -->
<div class="modal fade" id="logoffModal" tabindex="-1" role="dialog" aria-labelledby="logoffModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <div class="prompt-text">点击"确定"退出账号</div>
                <div class="bgimg_lf"></div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary">确定</button>
            </div>
        </div>
    </div>
</div>

<!-- 发起活动的模态框 -->
<!-- organize activities -->
<div class="modal fade" id="OAModal" tabindex="-1" role="dialog" aria-labelledby="OAModalLabel" aria-hidden="true">
    <div class="modal-dialog dialog-oa">
        <div class="modal-content content-oa">
            <div class="modal-body body-oa">
                <div class="prompt-text">${msg}</div>
                <div class="bgimg_oa"></div>
            </div>
        </div>
    </div>
</div>

<!--引入JQuery,再引入popper.js，最后引入bootstrap.js-->
<script src="${path}/js/jquery.min.js"></script>
<script src="${path}/js/bootstrap.bundle.js"></script>
<!-- 引入富文本编辑器.js -->
<script type="text/javascript" src="${path}/js/wangEditor.min.js"></script>
<script type="text/javascript">
    const E = window.wangEditor
    const editor = new E('#div1')
    const $text1 = $('#inputContent')
    editor.config.focus = false
    editor.config.onchange = function (html) {
        // 第二步，监控变化，同步更新到 textarea
        $text1.val(html)
    }
    editor.create()

    // 第一步，初始化 textarea 的值
    $text1.val(editor.txt.html())

    //模态框显示和隐藏时 div编辑框样式更改
    $('#logoffModal').on('show.bs.modal', function () {
        $('.w-e-text').css({"background-color": "rgb(128,128,128)"});
        $('.w-e-text-container').css('cssText',
            'border:1px solid rgb(103,106,109) !important; border-top:none !important; height:240px !important; z-index:10000 !important; background-color:rgb(128,128,128) ');
    });
    $('#logoffModal').on('hide.bs.modal', function () {
        $('.w-e-text').css({"background-color": "rgb(255,255,255)"});
        $('.w-e-text-container').css('cssText',
            'border:1px solid rgb(206,212,218) !important; border-top:none !important; height:240px !important; z-index:10000 !important; background-color:rgb(255,255,255) ');
    });

    $('#OAModal').on('show.bs.modal', function () {
        $('.w-e-text').css({"background-color": "rgb(128,128,128)"});
        $('.w-e-text-container').css('cssText',
            'border:1px solid rgb(103,106,109) !important; border-top:none !important; height:240px !important; z-index:10000 !important; background-color:rgb(128,128,128) ');
    });
    $('#OAModal').on('hide.bs.modal', function () {
        $('.w-e-text').css({"background-color": "rgb(255,255,255)"});
        $('.w-e-text-container').css('cssText',
            'border:1px solid rgb(206,212,218) !important; border-top:none !important; height:240px !important; z-index:10000 !important; background-color:rgb(255,255,255) ');
    });


    $(document).ready(function () {

        $(".oa-btn").on("click", function () {

            $("#OAModal").modal('show');
            setTimeout("$('#OAModal').modal('hide')", "10000");
        })
        $(".w-e-text").html("${activity.content}")
    });

</script>
<shiro:authenticated>
    <script src="/js/message.js"></script>
</shiro:authenticated>
</body>

</html>